<template>
  <div class="home-main">
    <swipe :banner="banner"></swipe>
    <x-title title="精选主题"></x-title>
    <x-theme :theme="theme"></x-theme>
    <x-title title="最新新品"></x-title>
    <goods-list :product="product"></goods-list>
  </div>
</template>
<script>
import axios from "axios";
import xTitle from "./components/title.vue";
import xTheme from "./components/theme.vue";
import goodsList from "./components/goodsList.vue";
import { getBanner, getTheme, getProduct } from "@/api/home";
export default {
  name: "home",
  components: {
    xTitle,
    xTheme,
    goodsList
  },
  data() {
    return {
      banner: [], //轮播图
      theme: [], //主题
      product: [] //新品
    };
  },
  //组件守卫
  // beforeRouteEnter(to,from,next){
  //   console.log(this)
  //   next(vm=>{//vm形参
  //     console.log( vm.name)
  //   })
  // },
  // beforeRouteLeave(to,from,next){
  //   alert('你确定要离开吗？')
  //   console.log('我要离开')
  //   next()
  // },

  created() {
    // getBanner().then(res=>{
    //   console.log(res)
    // });

    // let base = 'https://yc211.cn:88/api/v1'
    // axios.defaults.baseURL = 'https://yc211.cn:88/api/v1'
    this.$axios.all([getBanner(), getTheme(), getProduct()]).then(
      this.$axios.spread((banner, theme, product) => {
        console.log(banner);
        console.log(theme);
        // console.log(product)
        // this.banner = banner
        for (let i = 0; i < banner.items.length; i++) {
          this.banner.push(banner.items[i].img);
        }
        this.theme = theme;
        // product.pop();  //删除最后一个元素
        this.product = product;
      })
    );

    // document.title = this.$route.meta.title;
    // console.log(this.$route); //获取当前激活的路由信息
    // console.log(document.title);//获取当前网页标题
  },
  methods: {
    goMy() {
      //不传参
      //传参    params传参 相当于post 比较安全
      this.$router.push({
        name: "/my",
        query: { id: 1 }
      });
      this.$router.push("/my"); //history栈中会记录
      //this.$router.replace('/my')//history栈中不会记录  点击返回回到上上个页面
      //this.$router.go(n)//n代表整数   向前向后跳n个页面，但确保history栈中有记录
    }
  }
};
</script>
<style lang="scss" scoped>

.home-main {
  @include s-y-h(2.6rem);
}
</style>